<template>
	<view class="memberPermissionPage">
		<mescroll-body ref="mescrollRef" :height="windowHeight+'rpx'" @init="mescrollInit" @down="downCallback"
			@up="upCallback" :up="upOption" :down="downOption">
			<block v-for="(item,index) in list" :key="index">
				<view class="memberPermissionList">
					<view class="flex-between padding-bottom_20rpx ">
						<view class="flex">

							<view class="flex-columns-center margin-left_30rpx">
								<text class="font-weight_bold margin-bottom_10rpx"
									style="font-size: 30rpx;">充值金额：{{item.amount}}</text>

								<text
									style="color: rgb(80, 77, 78);font-size: 24rpx;text-align: left;">赠送金额：{{item.give_amount}}
								</text>
							</view>
						</view>
						<view class="flex-column-end margin-left_30rpx">
							<switch :checked="item.status==1?true:false" style="transform:scale(0.7)"
								@change="e=>switch1Change(e,item)" />
						</view>
					</view>
					<view class="flex-between">
						<view class="">
							<text style="color:rgb(153, 153, 153)">创建时间：{{item.create_time}}</text>

						</view>
						<view class="flex">
							<view style="color:rgb(153, 153, 153)" class="margin-right_30rpx flex"
								@click="editFn(item)">
								<uni-icons type="compose" size="17"></uni-icons>
								编辑

							</view>
							<view style="color:rgb(153, 153, 153)" class="margin-right_30rpx flex"
								@click="delFn(item)">
								<uni-icons type="trash" size="17"></uni-icons>
								删除

							</view>
						</view>

					</view>
				</view>
			</block>
		</mescroll-body>
		<view class="btnSure flex" @click="newAdd()">
			立即添加
		</view>
	</view>
</template>

<script>
	export default {
		components: {

		},
		data() {
			return {
				tabIndex: 4,
				memberPermissiontArr: [],
				token: uni.getStorageSync('login').token,
				downOption: {
					auto: true
				},
				// 上拉配置项
				upOption: {
					auto: true
				},
				token: uni.getStorageSync('login').token,
				windowHeight: '',
				list: [],
			}
		},
		onLoad() {
			uni.getSystemInfo({
				success: (res) => {
					this.windowHeight = res.windowHeight * 2 - 800;
				}
			});
		},
		onShow() {
			this.mescroll?.resetUpScroll();

		},
		methods: {
			newAdd() {
				this.$sun.navGo('/pages/rechargeAmount/addRechargeAmount')
			},
			async upCallback(scroll) {

				const result = await this.$http.post({
					url: this.$api.payAmount,
					data: {
						page: scroll.num,
						limit: 10

					},
					headers: {
						'Authorization': `Bearer ${this.token}`
					}

				})
				if (result.code == 0) {
					console.log('地址管理列表', result);
					this.mescroll.endByPage(result.data.list.length, this.$sun.pagingSum(result.data.count, 10));
					if (scroll.num == 1) this.list = [];
					this.list = this.list.concat(result.data.list);
					console.log('this.list', this.list, this.list.length);
				}
			},



			editFn(item) {
				this.$sun.navGo('/pages/rechargeAmount/addRechargeAmount', {
					...item
				})
			},

			async switch1Change(e, item) {
				console.log('switch1 发生 change 事件，携带值为', e.detail.value)


				const result = await this.$http.post({
					url: this.$api.setStatus,
					data: {
						id: item.id,
						status: item.status == 2 ? 1 : 2

					},
					headers: {
						'Authorization': `Bearer ${this.token}`
					}

				})
				if (result.code == 0) {
					this.mescroll?.resetUpScroll();
					this.$sun.toast(result.msg, 'none')
				} else {
					this.$sun.toast(result.msg, 'none')
				}
			},
			delFn(item){
				uni.showModal({
					title: '提示',
					content: '是否删除该条信息',
					success: async (res) => {
						if (res.confirm) {
				
							const result = await this.$http.post({
								url: this.$api.delPayAmount,
								data: {
									id: item.id,
									
				
								},
								headers: {
									'Authorization': `Bearer ${this.token}`
								}
				
							})
							if (result.code == 0) {
								this.mescroll?.resetUpScroll();
								this.$sun.toast(result.msg, 'none')
							} else {
								this.$sun.toast(result.msg, 'none')
							}
						} else if (res.cancel) {
				
						}
					}
				});
			}
		}
	}
</script>

<style lang="less" scoped>
	page {
		background: #fff;
	}

	.memberPermissionPage {
		padding: 20rpx;

		.btnSure {
			width: 94%;
			height: 76rpx;
			background: rgb(81, 142, 247);
			color: rgb(255, 255, 255);
			border-radius: 108rpx;
			font-size: 32rpx;
			font-weight: 700;
			position: fixed;
			bottom: 20rpx;
		}

		.memberPermissionList {
			margin-top: 20rpx;
			padding: 20rpx;
			background: rgb(245, 248, 255);

			.image {
				width: 76rpx;
				height: 76rpx;

			}
		}

	}
</style>